<template>
  <view class="team">
    <TeamList v-if="!matchFlag" />
    <TeamTagsList v-else ref="teamTagsListRef" />
    <MatchOperator @changeSwitchStatus="handleSwitchChange" />
  </view>
</template>

<script>
import TeamList from "./components/TeamList.vue";
import TeamTagsList from "./components/TeamTagsList.vue";
import MatchOperator from "../../components/public/MatchOperator.vue";
export default {
  name: "Team",
  components: {
    TeamList,
    TeamTagsList,
    MatchOperator,
  },
  data() {
    return {
      matchFlag: false,
    };
  },

  methods: {
    handleSwitchChange(status) {
      this.matchFlag = !this.matchFlag;
      if (status) {
        this.$nextTick(() => {
          this.$refs.teamTagsListRef.getTeamTagsListData();
        });
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.team {
  padding-bottom: 120rpx;
  position: relative;
}
</style>
